::selection 
{
    background: #0CB640;
    color: #fff;
}
body{
	font-family: Arial, Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
	color: #1C1C1C;
}
/*----------------------.top-login-reg-------------------------*/
.top-login-reg{
	width: 100%;
	margin: 5px 0 0 0;
	text-align: right;
}
.top-login-reg .btn{
	float: right;
	width: 20%;
}
.top-login-reg span{
	color: #f0f0f0;
	display: inline-block;
	*display: inline;
	zoom: 1;
	width: 67%;
	margin: 0 4% 0 0;
	vertical-align: middle;
	padding: 8px 0;
}
/*--------------------------.header-topbar-----------------------------------*/
.header-topbar{
	background: #1C1C1C;
	height: 3em;
}
.header-topbar.active{
	position: fixed;
	left: 0;
	right: 0;
	top: 0;
	z-index: 50;
}
.header-wrap{
	width: 80%;
	margin: auto;
	height: 100%;	
}
.left-header {
	width: 48%;
	height: 100%;
	float: left;
}
.right-header {
	float: right;
	width: 49%;
	height: 100%;
}
.logo-block{
	color: #ccc;
	height: 100%;
	width: 11.5%;
}
.logo-block img{
	max-width: 100%;
	min-width: 32px;
	_width: 100%;
	max-height: 100%;
	min-height: 32px;
	_height: 100%;
}
.logo-block a{
	display: block;
	height: 90%;
	padding-top: 4px;
	width: 100%;
}
/*--------------------.top-menu----------------------*/
.search-box{
	margin: 5.5px 0 0 0;
	float: right;
	width: 87.5%;
}
.search-box .txt{
	width: 74%;
	border: none;
	float: right;
	padding-left: 3%;
	padding-right: 3%;
}
.search-box .btn{
	float: right;
	width: 18%;
	margin-left: 1.5%;
	background-image: url(../img/search-btn.png);
	background-repeat: no-repeat;
	background-position: center;
	text-indent: 200%;
}
/*--------------------.notify-icons-list----------------*/
.notify-icons-list{
	height: 100%;
	float: right;
	margin-right: 1%;
	width: 50%;
	min-width: 80px;
	_width: 80px;
}
.notify-icons-list >ul{
	height: 100%;
	width: 100%;
}
.notify-icons-list >ul >li{
	float: right;
	width: 50%;
	height: 100%;
	position: relative;
	min-width: 2em;
	max-width: 2.5em;
	*min-width: 2em;
	z-index: 20;
}
.count-notice{
	width: 16px;
	height: 16px;
	line-height: 16px;
	text-align: center;
	font-size: 6pt;
	background: #eb3e2d;
	position: absolute;
	color: #fff;
	z-index: 10;
	right: 0;
	top: 2px;
	-webkit-border-radius: 100%;
	-moz-border-radius: 100%;
	border-radius: 100%;
}
.notify-icons-list .btn-icon{
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	height: 100%;
}
.notify-icons-list .btn-icon:hover, .notify-icons-list .btn-icon.active{
	background-color: #3b3b3b;
}

.notify-icon{
	background: url(../img/new-notify.png) no-repeat center 50%;
}
.message-icon{
	background: url(../img/new-comment.png) no-repeat center 50%;
}
.notice-panel{
	position: absolute;
	top: 110%;
	width: 15em;
	left: -100%;
	-webkit-box-shadow: 0 1px 1px #f0f0f0;
	-moz-box-shadow: 0 1px 1px #f0f0f0;
	box-shadow: 0 1px 1px #f0f0f0;
	border-left: 1px solid #ccc;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
}

.notice-panel ul{
	background: #fff;
	font-size: 12px;
	position: relative;
	max-height: 20em;
	_height: 20em;
	width: 100%;
	overflow: hidden;
}
.notice-panel ul.active{
	background: #fff url(../img/s_loader_gr.gif) no-repeat center;
}
.notice-panel .top-arrow{
	left: 23%;
	right: 77%;
}
.top-arrow{
	width: 0;
	position: absolute;
	top: -5px;
	height: 0;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-bottom: 5px solid #1C1C1C;
}
.notice-panel h3{
	background: #1C1C1C;
	font-weight: normal;
	color: #ecf0f1;
	padding: 0.5em 0.5em;
	font-size: 16px;
}
.notice-panel li{
	border-bottom: 1px dotted #ccc;
}
.notice-panel li.no-read a{
	background: #f0f0f0;
}
.notice-panel li a{
	display: block;
	padding: 0.3em 0.5em 0.3em 0.5em;
}
.notice-panel li a:hover{
	background: #f0f0f0;
}
.notice-panel ul p{
	font-weight: bold;
	color: #3b3b3b;
}
.notice-panel ul span{
	color: #666;
	display: block;
}
.notice-panel ul label{
	font-size: 10px;
	color: #ccc;
}
.notice-panel .more-notice{
	background: #f0f0f0;
	font-size: 16px;
	text-align: center;
	border-top: 1px solid #ccc;
}
.more-notice a{
	color: #43be3f;
	display: block;
	padding: 0.5em 0.5em;
}
.more-notice a:hover{
	color: #3c9d38;
	background: #e8e8e8;
}
/*--------------------.profile-acc----------------------*/
.profile-acc {
	float: right;
	padding: 0 0 0 0;
	height: 100%;
	width: 30%;
	min-width: 120px;
	_width: 120px;
}
.account-name{
	width: 100%;
	position: relative;
	float: right;
	z-index: 20;
	height: 100%;
}
.account-name a.user-name{
	color: #f0f0f0;
	text-align: center;
	position: relative;
	height: 100%;
	display: block;
}

.user-profile-avatar {
	float: right;
	width: 25%;
}
.user-name img{
	width: 25%;
	min-width: 32px;
	_width: 32px;
	min-height: 32px;
	_height: 32px;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;
	position: absolute;
	right: 0;
	top: 12%;
	bottom: 12%;
}

a.user-name em{
	font-weight: normal;
	float: left;
	width: 70%;
	font-style: normal;
	padding: 0.8em 0;
	text-align: left;
}
.profile-arrow{
	display: block;
	width: 0;
	height: 0;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-top: 5px solid #f0f0f0;
	position: absolute;
	top: 45%;
	right: 35%;
	bottom: 50%;
}
.drop-down-profile h3{
	background: #1C1C1C;
	font-weight: normal;
	color: #ecf0f1;
	position: relative;
	padding: 0.5em 0.5em;
	font-size: 16px;
}
.drop-down-profile .top-arrow{
	right: 20%;
}
.drop-down-profile {
	position: absolute;
	right: 0;
	width: 15em;
	top: 110%;
	display: none;
	-webkit-box-shadow: 0 1px 1px #f0f0f0;
	-moz-box-shadow: 0 1px 1px #f0f0f0;
	box-shadow: 0 1px 1px #f0f0f0;
	border-left: 1px solid #ccc;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
}
.drop-down-profile .main-drop-down{
	background: #fff;
	height: 5em;
	width: 100%;
}
.main-drop-down li{
	float: left;
	width: 50%;
	height: 100%;
	text-align: center;
}
.main-drop-down li:hover{
	background: #f0f0f0;
}
.main-drop-down a{
	color: #1c1c1c;
	display: block;
	height: 40%;
	padding: 20% 0;
}
.main-drop-down li span.icon{
	width: 16px;
	height: 16px;
	margin: auto;
	display: block;
	margin-bottom: 5%;
	background: url(../img/profile-sprite.png) no-repeat;
}
.main-drop-down .user-profile-link .icon{
	background-position: 0 0;
}
.main-drop-down .usercp-link .icon{
	background-position: -16px 0;
}
.main-drop-down li:hover .user-profile-link .icon{
	background-position: 0 -16px;
}

.main-drop-down li:hover .usercp-link .icon{
	background-position: -16px -16px;
}
.second-drop-down li{
	height: 2em;
	border-top: 1px solid #ccc;
}
.second-drop-down li a{
	display: block;
	padding: 2.5% 0.5em 2.5% 0.5em;
	background-color: #f0f0f0;
	height: 62%;
}
.second-drop-down li a:hover{
	background-color: #e8e8e8;
}
.second-drop-down li span{
	float: left;
	margin-left: 0.5em;
	line-height: 1em;
	margin-top: 1px;
}
.second-drop-down li .icon{
	width: 16px;
	height: 16px;
	float: left;
	margin-top: 1px;
	background: url(../img/profile-sprite.png) no-repeat;
}
.second-drop-down .support-link .icon{
	background-position: -48px 0;
}
.second-drop-down .law-link .icon{
	background-position: -61px 0;
}
.second-drop-down .logout-link .icon{
	background-position: -32px 0;
}
.second-drop-down .about-link .icon{
	background-position: -77px 0;
}
.second-drop-down .support-link:hover .icon{
	background-position: -48px -16px;
}
.second-drop-down li:hover .logout-link .icon{
	background-position: -32px -16px;
}
.second-drop-down li:hover .about-link .icon{
	background-position: -77px -16px;
}
.second-drop-down li:hover .law-link .icon{
	background-position: -61px -16px;
}
/*----------------------.header-bottom-----------------------*/
.header-bottom{
	background: #f0f0f0;
	height: 3em;
	clear: both;
}
.header-bottom .header-wrap{
	font-size: 16px;
}
.category-list{
	min-width: 23.5%;
	*width: 23.5%;
	max-width: 24%;
	*max-width: 24%;
	*min-width: 23.5%;
	float: right;
	margin-top: 0.3em;
	position: relative;
	z-index: 10;
}
.category-list .dropdown-toggle{
	display: block;
	height: 1em;
	padding: 0.6em 0.5em;
	background: #fff url(../img/list-icon.png) no-repeat 96% center;
	border: 1px solid #e8e8e8;
	-webkit-box-shadow: 0 1px 1px #f0f0f0;
	-moz-box-shadow: 0 1px 1px #f0f0f0;
	box-shadow: 0 1px 1px #f0f0f0;
	text-transform: uppercase;
}
.category-list .dropdown-toggle.active{
	-webkit-border-bottom-right-radius: 0;
	-webkit-border-bottom-left-radius: 0;
	-moz-border-radius-bottomright: 0;
	-moz-border-radius-bottomleft: 0;
	border-bottom-right-radius: 0;
	border-bottom-left-radius: 0;
	border-bottom: 0;
}
.dropdown-toggle span{
	display: block;
	height: 100%;
	line-height: 1em;
}
.category-list ul
{
    clear: both;
    background: #fff;
	border-top: 1px dotted #f0f0f0;
	border-bottom: 1px solid #f0f0f0;
	border-left: 1px solid #f0f0f0;
	border-right: 1px solid #f0f0f0;
	padding: 0 0 0.2em 0;
	-webkit-box-shadow: 0 1px 1px #f0f0f0;
	-moz-box-shadow: 0 1px 1px #f0f0f0;
	box-shadow: 0 1px 1px #f0f0f0;
	display: none;
	position: absolute;
}
.category-list >ul{
	top: 90%;
	left: 0;
	width: 99%;
}
.category-list >ul.active{
	
}
.child-toggle
{
    display: none;
    position: absolute;
    top: 0;
    right: 100%;
    width: 80%;
    min-height: 98%;
}
.child-toggle.active{
	display: block;
	background: #f9f9f9;
	border-right: 1px solid #ccc;
}
.child-toggle.active li
{
    border-bottom: 1px solid #f0f0f0;
}
.category-list >ul li
{
	border-bottom: 1px dotted #f0f0f0;
}
.category-list li a{
	display: block;
	line-height: 1em;
	padding: 0.5em;
}
.category-list li a:hover{
	background: #0CB640;
	color: #fff;
}
.navbar{
	float: left;
	height: 100%;
	width: 60%;
}
.navbar ul{
	width: 100%;
	height: 100%;
}
.navbar li{
	float: left;
	width: 30.7%;
	height: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	margin-right: 1%;
}
.navbar li.active a,.navbar li:hover a{
	background: #fff;
	color: #0CB640;
	border-top: 1px solid #e8e8e8;
	border-right: 1px solid #e8e8e8;
	border-left: 1px solid #e8e8e8;
}
.navbar li a{
	display: block;
	padding: 8px 0 8px 0;
	position: relative;
	text-transform: uppercase;
	text-align: center;
	margin-top: 0.25em;
	border: 1px solid #f0f0f0;
	text-indent: 20px;
}
.navbar .btn-icon{
	position: absolute;
	left: 5%;
	top: 15%;
	bottom: 20%;
	width: 24px;
	height: 24px;
	background-image: url(../img/nav-sprite.png);
}
.btn-random{
	background-position: -24px 0px;
}
.btn-newest{
	background-position: 0 0px;
}
.btn-most-view{
	background-position: -48px 0;
}
.navbar li:hover .btn-random, .navbar li.active .btn-random{
	background-position: -24px -24px;
}
.navbar li:hover .btn-newest, .navbar li.active .btn-newest{
	background-position: 0 -24px;
}
.navbar li:hover .btn-most-view, .navbar li.active .btn-most-view{
	background-position: -48px -72px;
}
.navbar .menu-photo
{
    width: 24px;
    height: auto;
    margin-left: 5%;
    clear: both;
}
.menu-photo img
{
    display: block;
    float: left;
    width: 100%;
    max-height: 100%;
}
.menu-photo
{
    margin-left: 1em;
}
/*-------------------.content-container------------------*/
.content-container{
	width: 100%;
	float: left;
	margin: auto;
	min-height: 26em;
	_height: 26em;
	margin-top: 1em;
	margin-bottom: 4em;
}
.content-wrap{
	width: 80%;
	margin: auto;
}
/*----------------------#main-footer-------------------------*/
#footer{
	clear: both;
	border-top: 1px solid #f0f0f0;
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 100;
	background: #fff;
	height: 0;
}
#footer.active{
	height: auto;
}
.footer-arrow{
	background: #fff;
	border-left: 1px solid #e8e8e8;
	border-right: 1px solid #e8e8e8;
	border-top: 4px solid #e8e8e8;
	-moz-box-shadow: 0 -3px 3px -1px #ccc;
	-webkit-box-shadow: 0 -3px 3px -1px #ccc;
	box-shadow: 0 -3px 3px -1px #ccc;
	width: 7em;
	height: 35px;
	position: absolute;
	top: -39px;
	cursor: pointer;
	-webkit-border-top-left-radius: 3px;
	-webkit-border-top-right-radius: 3px;
	-moz-border-radius-topleft: 3px;
	-moz-border-radius-topright: 3px;
	border-top-left-radius: 3px;
	border-top-right-radius: 3px;
}

.footer-arrow span{
	float: left;
	margin: 0.5em 0 0 0.5em;
	line-height: 1em;
	font-size: 16px;
	color: #666;
}
.icon-arrow{
	width: 20px;
	height: 14px;
	background: url(../img/icon-arrow.png) no-repeat left top;
	float: right;
	color: #666;
	margin: 0.5em 0.5em 0 0;
}
.footer-arrow.active .icon-arrow{
	background-position: -22px 0px;
}
.body-foot{
	width: 80%;
	margin: auto;
	padding-bottom: 0.5em;
	padding-top: 1em;
	position: relative;
}
.body-foot li{
	float: left;
	width: 22.9%;
	margin: 0 2% 0 0;
	font-size: 16px;
}
.body-foot h4{
	font-weight: normal;
	font-size: 16px;
	color: #1C1C1C;
	margin-bottom: 0.6em;
}
.body-foot p{
	font-weight: normal;
	font-size: 13px;
	line-height: 1.5em;
	margin-bottom: 0.5em;
	color: #666;
	font-style: italic;
}
.body-foot li li{
	float: none;
	width: 100%;
	font-size: 13px;
}
.body-foot a{
	float: none;
	width: 100%;
	color: #666666;
	display: block;
	margin: 0 0 4% 0;
}

.f-phone{
	background: url(../img/sphone.png) no-repeat left center;
	text-indent: 25px;
	display: block;
	height: 30px;
	color: #0CB640;
	line-height: 30px;
}
#txt-sign-email{
	width: 65%;
	float: left;
}
#btn-sign-email{
	width: 30%;
	float: left;
	height: 2.35em;
}
/*----------------------.pager-control -------------------------*/
.pager-control{
	clear: both;
}
.pager-control .btn{
	float: none;
	width: 25%;
	text-align: center;
	text-transform: uppercase;
	margin: auto;
}


/*--------------------#pager---------------*/
#pager{
	padding: 0;
	width: 60%;
	margin: 0.5em auto;
	height: 24px;
	text-align: center;
}
#pager .bullet-list{
	width: 100%;
	display: inline-block;
	*display: inline;
	zoom: 1;
	height: 100%;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}
#pager .prev, #pager .next{
	text-indent: -9999999999999999px;
}
#pager .prev:hover, #pager .next:hover{
	background-color: #ccc;
}
#pager .prev{
	background: #fff url(../img/arrow-prev.png) no-repeat center;
}
#pager .next{
	background: #fff url(../img/arrow-next.png) no-repeat center;	
}
#pager a{
	text-decoration: none;
}
#pager li{
	display: inline-block;
	*display: inline;
	zoom: 1;
	width: 1.7em;
	margin: 0 0.5% 0 0.5%;
	position: relative;
}
#pager li a{
	background: #fff;
	height: 24px;
	text-align: center;
	line-height: 24px;
	width: 24px;
	display: block;
	font-size: 13px;
	color: #666;
	margin: auto;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}
#pager li a.active{
	background-color: #ccc;
	color: #fff;
}
#pager li a:hover{
	background-color: #0CB640;
	color: #fff;
}
/*---------------------Alert-Ticker-Validate-----------------------*/
.alert-ticker
{
    color: #fff;
    min-width: 80%;
    padding: 10px 5px;
    text-align: center;
    position: absolute;
    background: #eb3e2d;
    right: 100%;
    font-size: 13px;
    bottom: 0;
    -webkit-border-top-left-radius: 3px;
    -webkit-border-bottom-left-radius: 3px;
    -moz-border-radius-topleft: 3px;
    -moz-border-radius-bottomleft: 3px;
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px;
    border: 1px solid #c0392b;
}
.alert-ticker-arrow
{
    position: absolute;
    width: 0;
    height: 0;
    border-top: 7px solid transparent;
    border-bottom: 7px solid transparent;
    border-left: 7px solid #eb3e2d;
    display: block;
    right: -5px;
    top: 30%;
}

@media screen and (max-width : 961px) and (min-width : 769px){
	.navbar{
		width: 74%;
	}
	.navbar li{
		width: 30%;
	}
	.category-list{
		min-width: 23.5%;
		max-width: 24%;
	}
}
@media screen and (max-width : 768px) and (min-width : 479px){
	.navbar{
		width: 74%;
	}
	.navbar li{
		width: 30%;
	}
	.category-list{
		min-width: 23.5%;
		max-width: 24%;
	}
	.navbar li span{
		display: none;
	}
	.navbar li span.btn-icon{
		display: block;
		position: static;
		margin: auto;
	}
	.category-list{
		min-width: 7em;
		max-width: 7.5em;
	}
	.navbar {
		width: 65%;
	}
}
@media screen and (max-width : 480px) and (min-width : 0){
	.header-wrap {
		width: 100%;
	}
	.body-foot{
		width: 100%;
	}
	.navbar li {
		width: 3em;
	}
	.navbar li a{
		height: 1.3em;
	}
	.navbar li span{
		display: none;
	}
	.navbar li span.btn-icon{
		display: block;
		position: static;
		margin: auto;
	}
	.category-list{
		min-width: 4em;
		max-width: 4.5em;
	}
	.category-list .dropdown-toggle{
		background-position: center;
	}
	.dropdown-toggle span{
		display: none;
	}
}
@media screen and (max-width : 768px){
	a.user-name h2{
		display: none;
	}
	.profile-acc{
		width: auto;
	}
	.header-topbar{
		height: auto;
	}
	.left-header{
		float: none;
		width: auto;
	}
	.right-header{
		float: none;
		width: auto;
		height: 3em;
	}
	.notify-icons-list{
		margin-right: 0;
		float: left;
		width: auto;
	}
}